<!DOCTYPE html>  
<html>  
    <head>  
        <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />  
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
        <title>Hello, World</title>  
        <style type="text/css">  
			html{height:100%}  
			body{height:100%;margin:0px;padding:0px}  
			#container{height:100%}  
        </style>  
        
		<script id="map_load" type="text/javascript" src="map_load.js"></script>
        
    </head>  

    <body>  
        <div id="container"></div> 
        <script type="text/javascript"> 
            var outputPath = 'tiles/';    //地图瓦片所在的文件夹
			var fromat = ".jpg";    //格式

			var tileLayer = new BMap.TileLayer({
				isTransparentPng: true
			});
			tileLayer.getTilesUrl = function (tileCoord, zoom) {
				var x = tileCoord.x;
				var y = tileCoord.y;
				return outputPath + zoom + '/' + x + '/' + y + fromat;
			}
			var map = new BMap.Map('container',{
				minZoom: 15,
          		maxZoom: 19
			});
			map.addTileLayer(tileLayer);
			var point = new BMap.Point(121.492666, 31.220984);  // 创建点坐标  
			map.centerAndZoom(point, 15);               // 初始化地图，设置中心点坐标和地图级别  
			
			map.enableScrollWheelZoom(); //启用滚轮放大缩小
			map.enableKeyboard(); //启用键盘操作，默认禁用。键盘的上、下、左、右键可连续移动地图。
			map.enableContinuousZoom(); //启用连续缩放效果
			// //单击获取点击的经纬度
			map.addEventListener("click",function(e){
				map.clearOverlays();
				//console.log('换位置百度的经度:'+e.point.lng+' , 纬度: '+e.point.lat);
				var point = new window.BMap.Point(e.point.lng, e.point.lat);
				var marker = new window.BMap.Marker(point);
				map.addOverlay(marker);
				marker.enableDragging();

				window.parent.postMessage({
					cmd:'getPoint',
					params: e.point
				},'*')
				// this.add_newShop.lng = e.point.lng;
				// this.add_newShop.lat = e.point.lat;
				marker.addEventListener("dragend", (e) => {
					//console.log('拖动位置百度的经度:'+e.point.lng+' , 纬度: '+e.point.lat);
					// this.add_newShop.lng = e.point.lng;
					// this.add_newShop.lat = e.point.lat;
					window.parent.postMessage({
						cmd:'getPoint',
						params: e.point
					},'*')
				});
			});
			
			console.log(window)
			window.addEventListener("message",function(event){
				console.log(event)
				var data = event.data;
				console.log(data.cmd)
				switch(data.cmd){
					case 'setPoint':
						var init_point = new window.BMap.Point(data.params.lng, data.params.lat);
						var init_marker = new window.BMap.Marker(init_point);
						map.addOverlay(init_marker);
						map.centerAndZoom(init_point, 19);   
						init_marker.enableDragging();
						init_marker.addEventListener("dragend", (e) => {
							window.parent.postMessage({
								cmd:'getPoint',
								params: e.point
							},'*')
						});
					break;
				}
			})
		</script>  
    </body>  
</html>